<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>瀑布流效果</title>
		<link rel="shortcut icon" href=img/favicon.ico type="image/x-icon" />
		<!--引入重置样式-->
		<link rel="stylesheet" href="css/normalize.css" />
		<!--引入自定义样式文件 -->
		<link rel="stylesheet" href="css/waterfall-flow.css" />

		<body>
			<!--全部图片展示容器-->
			<div class="container">
				<!--单个图片容器-->
				<div class="box">
					<div class="content">
						<img src='img/1.jpg' />
					</div>
				</div>
				<div class="box">
					<div class="content">
						<img src='img/2.jpg' />
					</div>
				</div>
				<div class="box">
					<div class="content">
						<img src='img/3.jpg' />
					</div>
				</div>
				<div class="box">
					<div class="content">
						<img src='img/4.jpg' />
					</div>
				</div>
				<div class="box">
					<div class="content">
						<img src='img/5.jpg' />
					</div>
				</div>
				<div class="box">
					<div class="content">
						<img src='img/6.jpg' />
					</div>
				</div>
				<div class="box">
					<div class="content">
						<img src='img/7.jpg' />
					</div>
				</div>
				<div class="box">
					<div class="content">
						<img src='img/8.jpg' />
					</div>
				</div>
				<div class="box">
					<div class="content">
						<img src='img/8.jpg' />
					</div>
				</div>
				<div class="box">
					<div class="content">
						<img src='img/9.jpg' />
					</div>
				</div>
				<div class="box">
					<div class="content">
						<img src='img/10.jpg' />
					</div>
				</div>
				<div class="box">
					<div class="content">
						<img src='img/11.jpg' />
					</div>
				</div>
				<div class="box">
					<div class="content">
						<img src='img/12.jpg' />
					</div>
				</div>
				<div class="box">
					<div class="content">
						<img src='img/1.jpg' />
					</div>
				</div>
				<div class="box">
					<div class="content">
						<img src='img/2.jpg' />
					</div>
				</div>
				<div class="box">
					<div class="content">
						<img src='img/3.jpg' />
					</div>
				</div>
				<div class="box">
					<div class="content">
						<img src='img/4.jpg' />
					</div>
				</div>
				<div class="box">
					<div class="content">
						<img src='img/5.jpg' />
					</div>
				</div>
				<div class="box">
					<div class="content">
						<img src='img/6.jpg' />
					</div>
				</div>
				<div class="box">
					<div class="content">
						<img src='img/7.jpg' />
					</div>
				</div>
				<div class="box">
					<div class="content">
						<img src='img/8.jpg' />
					</div>
				</div>
				<div class="box">
					<div class="content">
						<img src='img/8.jpg' />
					</div>
				</div>
				<div class="box">
					<div class="content">
						<img src='img/9.jpg' />
					</div>
				</div>
				<div class="box">
					<div class="content">
						<img src='img/10.jpg' />
					</div>
				</div>
				<div class="box">
					<div class="content">
						<img src='img/11.jpg' />
					</div>
				</div>
				<div class="box">
					<div class="content">
						<img src='img/12.jpg' />
					</div>
				</div>
				<div class="box">
					<div class="content">
						<img src='img/1.jpg' />
					</div>
				</div>
				<div class="box">
					<div class="content">
						<img src='img/2.jpg' />
					</div>
				</div>
				<div class="box">
					<div class="content">
						<img src='img/3.jpg' />
					</div>
				</div>
				<div class="box">
					<div class="content">
						<img src='img/4.jpg' />
					</div>
				</div>
				<div class="box">
					<div class="content">
						<img src='img/5.jpg' />
					</div>
				</div>
				<div class="box">
					<div class="content">
						<img src='img/6.jpg' />
					</div>
				</div>
				<div class="box">
					<div class="content">
						<img src='img/7.jpg' />
					</div>
				</div>
				<div class="box">
					<div class="content">
						<img src='img/8.jpg' />
					</div>
				</div>
				<div class="box">
					<div class="content">
						<img src='img/8.jpg' />
					</div>
				</div>
				<div class="box">
					<div class="content">
						<img src='img/9.jpg' />
					</div>
				</div>
				<div class="box">
					<div class="content">
						<img src='img/10.jpg' />
					</div>
				</div>
				<div class="box">
					<div class="content">
						<img src='img/11.jpg' />
					</div>
				</div>
				<div class="box">
					<div class="content">
						<img src='img/12.jpg' />
					</div>
				</div>
			</div>
			<!--引用jquery库-->
			<script type="text/javascript" src="js/jquery.js"></script>
			<!--引用自定义的库文件-->
			<script type="text/javascript" src="js/waterfall-flow.js"></script>
		</body>

</html>